<style type="text/css">
    .hide{display: none;}
    .clear{clear: both;}
    .laydate-time-list{padding-bottom:0;overflow:hidden}
    .laydate-time-list>li{width:50%!important;}
    .laydate-time-list>li:last-child { display: none;}
    .green{color: green;}
    .blue{color: #1E9FFF;}
    .red{color: red;}
    .xian{margin: 5px 0px;height: 1px;width: 100%;clear: both;border-top: 1px dashed #c1c1c1;}
    .h38{height: 38px;line-height: 38px;color: red;}
    .center{text-align: center!important;}
</style>
<script>
    var baseUrl = "<?php echo $baseUrl; ?>?t=1";
</script>

<div class="layui-row search-row" id="search-box">
    <div class="item">
        <div class="row" style="width: 500px">
            <div class="box">
                <span class="title">站点：</span>
                <div data-key="site_id" data-type="list" class="search-key list" >
                    <ul>
                        <li><span data-value>全部</span></li>
                        <?php foreach ($site as $item){ ?>
                            <li><span data-value="<?php echo $item['id']; ?>"><?php echo $item['name'];?></span></li>
                        <?php }?>
                    </ul>
                </div>
            </div>
        </div>
    </div>

</div>
<table data-url="<?php echo $baseUrl; ?>?action=list"
       data-search="#search-box"
       data-page=""
       id="data-list"
       lay-filter='data-list' style="display: none;">
    <thead>
    <tr>
        <th width="15%" align="center" field="name">途径点</th>
        <th width="15%" align="center" field="departuretime">发车时间</th>
        <th width="15%"  align="center" field="presaletime">预售时间</th>
        <th width="15%" align="center" field="closingtime">停售时间</th>
        <th width="15%" align="center" field="created_at">创建时间</th>
        <th width="15%" align="center" field="updated_at">更新时间</th>
        <th width="10%" align="center" toolbar="#tpl-cmd">操作</th>
    </tr>
    </thead>
</table>


<script type="text/html" id="tpl-cmd">
    <a href="javascript:;" onclick="app.edit.update(this)" class="layui-btn layui-btn-xs">编辑</a>
    <span style="display: none;">{{JSON.stringify(d)}}</span>
</script>


<script type="text/html" id="tpl-shift">
    <div class="layui-card" style="box-shadow: none;">
        <div class="layui-card-header">{{name}}排班</div>
        <div class="layui-card-body">
            <form class="layui-form" action="">

                <div class="layui-form-item">
                    <label class="layui-form-label">发车时间</label>
                    <div class="layui-input-inline">
                        <input type="text" name="departuretime"  class="layui-input" lay-verify="required" id="departuretime" placeholder="yyyy-MM-dd HH:mm" value="{{departuretime}}" readonly="readonly">
                    </div>
                    <div class="layui-form-mid layui-word-aux"></div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">预售时间</label>
                    <div class="layui-input-inline">
                        <input type="text" name="presaletime"  class="layui-input" lay-verify="required" id="presaletime" placeholder="yyyy-MM-dd HH:mm" value="{{presaletime}}" readonly="readonly">
                    </div>
                    <div class="layui-form-mid layui-word-aux"></div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">停售时间</label>
                    <div class="layui-input-inline">
                        <input type="text" name="closingtime"  class="layui-input" lay-verify="required" id="closingtime" placeholder="yyyy-MM-dd HH:mm" value="{{closingtime}}" readonly="readonly">
                    </div>
                    <div class="layui-form-mid layui-word-aux"></div>
                </div>

                <?php if(Cm::$app->limitPost('/platform/shift/point','save')){ ?>
                    <div class="layui-form-item">
                        <label class="layui-form-label"></label>
                        <div class="layui-input-block">
                            <button class="layui-btn" lay-submit="" lay-filter="shift">保存</button>
                        </div>
                    </div>
                <?php } ?>
            </form>
        </div>
    </div>
</script>

<script>
    var app = {
        tb:null,
        init: function () {
            app.tb = $('#data-list').table();
            this.laydate.init();
            this.form.init();
        },
        edit: {
            data:null,
            load: function () {

                layer.open({
                    title:false,
                    area:['500px','60%'],
                    type:1,
                    content:template('tpl-shift', this.data)
                });

                /*app.laydate.obj.render({
                    elem: '#departuretime'
                    ,type: 'datetime'
                    ,value: app.edit.data.departuretime
                    ,format: 'yyyy-MM-dd HH:mm'
                });*/
                app.laydate.obj.render({
                    elem: '#presaletime'
                    ,type: 'datetime'
                    ,trigger: 'click'
                    ,value: this.data.presaletime
                    ,format: 'yyyy-MM-dd HH:mm'
                });
                app.laydate.obj.render({
                    elem: '#closingtime'
                    ,type: 'datetime'
                    ,trigger: 'click'
                    ,value: this.data.closingtime
                    ,format: 'yyyy-MM-dd HH:mm'
                });
                app.form.render();
            },
            update: function (e) {
                var str=$(e).parent().find('span').html();
                var json=eval('('+str+')')
                this.data={
                    id:json.id,
                    departuretime:json.departuretime,
                    presaletime:json.presaletime.replace(/:[^:]*$/, ''),
                    closingtime:json.closingtime.replace(/:[^:]*$/, ''),
                };

                this.load();
            },
        },
        laydate:{
            obj:null,
            init:function(){
                layui.use('laydate', function(){
                    app.laydate.obj = layui.laydate;
                    layui.laydate.render({
                        elem: '#search-departuretime'
                        ,type: 'datetime'
                        ,trigger: 'click'
                        ,range: '至' //或 range: '~' 来自定义分割字符
                        ,done:function () {
                            setTimeout(function () {
                                app.tb.search();
                            },200)
                        }
                    });
                });
            }
        },
        form: {
            obj: null,
            init: function () {
                var form = layui.form;
                form.on('submit(shift)', function (data) {
                    app.edit.data.departuretime = data.field.departuretime;
                    app.edit.data.presaletime = data.field.presaletime;
                    app.edit.data.closingtime = data.field.closingtime;
                    app.save();
                    return false;
                });
                this.obj = form;
            },
            render: function () {
                this.obj.render();
            }
        },
        save:function () {
            $.post(baseUrl+'&action=save',this.edit.data,function (d) {
                if(d.flag)
                {
                    layer.closeAll();
                    layer.msg(d.msg);
                    $('#data-list').table();
                }else{
                    layer.msg(d.msg);
                }
            },'json')
        },
    };

    app.init();
</script>